import {ConfigProvider, message, notification, theme} from "antd";
import zhCN from 'antd/locale/zh_CN';
import {AppRouter} from "@/AppRouter.tsx";
import React, {useEffect} from "react";
import {MessageInstance} from "antd/es/message/interface";
import {NotificationInstance} from "antd/es/notification/interface";
import {useUserInfoStore} from "@/store/BaseStore.ts";
import UserApi from "@/api/UserApi.ts";

declare global {
    interface Window {
        messageApi: MessageInstance,
        notificationApi: NotificationInstance
    }
}

const App: React.FC = () => {
    const [messageApi, contextHolder] = message.useMessage();
    const [notificationApi, notificationContextHolder] = notification.useNotification();
    window.messageApi = messageApi
    window.notificationApi = notificationApi
    const saveUserInfo = useUserInfoStore(state => state.saveUserInfo);
    useEffect(() => {
        UserApi.getSelfInfo().then(data => {
            saveUserInfo(data)
        })
    }, []);

    return (
        <ConfigProvider
            theme={{
                algorithm: theme.darkAlgorithm
            }}
            locale={zhCN}
        >
            <AppRouter/>
            {contextHolder}
            {notificationContextHolder}
        </ConfigProvider>
    )
}

export default App